<!DOCTYPE html>
<html id="replace-style" lang="zh">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <link rel="icon" type="image/x-icon" href="/favicon.ico" th:href="@{/favicon.ico}" >
    <title>参数管理</title>

</head>
<body>
<!--头部-->
<header th:replace="common/head" >
</header>
<!-- 页面指向 -->
<div class="page-point bg-white">
    <ul>
        <li>首页</li>
        <li>设备管理</li>
        <li>参数管理</li>
    </ul>
</div>
<!-- 菜单树 -->
<div th:replace="common/left" >
</div>
<!-- 底部 -->
<div th:replace="common/foot" >
</div>



<!--主体内容-->
<div class="page-container">

    <div class="container-fluid mb-20 clearfix">
        <div class="col-md-12">
            <h2 class="page-section-title">查询条件</h2>
        </div>
    </div>

    <div class="container-fluid query-frame-wrap mb-10 clearfix">
        <div class="col-lg-3">
            <div class="query-frame">
                <label>设备型号</label>
                <select name="" class="queryViewParam queryEuqipModel" id="viewEmModel">
                    <option th:value="${modelCode}" th:text="${modelCode}"></option>
                </select>
            </div>
        </div>
        <div class="col-lg-3">
            <div class="query-frame">
                <label>设备类别</label>
                <!-- <input type="text" class="form-control queryParam" /> -->
                <select id="paramModelType"  class="form-control queryParam">
                    <option value="">全部</option>
                    <option value="1">生产类</option>
                    <option value="2">环境类</option>
                    <option value="3">能源类</option>
                    <option value="4">检测类</option>
                    <option value="5">生产辅助类</option>
                </select>

            </div>
        </div>
        <div class="col-lg-3">
            <div class="query-frame">
                <label>参数名称</label>
                <input type="text" class="form-control queryParam" id="paramName"/>
            </div>
        </div>
        <div class="col-lg-3">
            <div class="query-frame query-button">
                <img th:src="@{/image/search.png}" id="queryParam"/>
                <img th:src="@{/image/rest.png}" id="resetParam" class="reset"/>
            </div>
        </div>
    </div>

    <div class="container-fluid mb-20 clearfix">
        <div class="col-md-12 rlt">
            <h2 class="page-section-title">设备参数列表</h2>
            <ul class="table-tool">
                <li id="batchImport" shiro:hasPermission="app.equipment.param.batchImportParam.save.mvc">
                    <span class="icon-piliang" aria-hidden="true"></span>
                    <label>批量导入</label>
                </li>
                <li id="downloadTemplate" shiro:hasPermission="app.equipment.param.downloadImportTemplate.get.mvc">
                    <span class="icon-xiazai" aria-hidden="true"></span>
                    <label>下载模板</label>
                </li>
                <li id="addParam" shiro:hasPermission="app.equipment.param.saveCollectionParam.save.mvc">
                    <span class="icon-list_add" aria-hidden="true"></span>
                    <label>新增</label>
                </li>
                <li id="updateParam" shiro:hasPermission="app.equipment.param.saveCollectionParam.save.mvc">
                    <span class="icon-list_xiugai" aria-hidden="true"></span>
                    <label>修改</label>
                </li>
                <li id="delParam" shiro:hasPermission="app.equipment.param.delCollectionParam.del.mvc">
                    <span class="icon-list_shanchu" aria-hidden="true"></span>
                    <label>删除</label>
                </li>
                <li class="last" id="refreshParam">
                    <span class="icon-list_shuaxin" aria-hidden="true"></span>
                    <label>刷新</label>
                </li>
            </ul>
        </div>
    </div>

    <div class="container-fluid table-container">
        <table id="paramTable">

        </table>
    </div>
</div>

<!--模态框-表单验证和文件上传-->
<div class="modal fade paramForm" id="myModal" tabindex="-1" role="dialog" data-backdrop="static" data-keyboard="false" >
    <div class="modal-dialog" role="document" style="width: 900px">
        <div class="modal-content " >
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">Newly added</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-lg-12">
                        <form id="defaultForm" method="" class="form-horizontal " action="">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-4">设备型号</label>
                                    <div class="col-lg-7">
                                        <select  class="form-control queryEuqipModel emModelName"  name="modelCode">
                                            <option value="">请选择</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-lg-3 control-label ">设备类别</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" type="text" disabled="disabled" class="form-control" name="modelType" value="" />
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-lg-3 control-label ">所属工序</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" type="text" disabled="disabled" class="form-control" name="operation" value="" />
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-4">参数编号</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" type="text" class="form-control" name="paramCode" value="" id="paramCode" />
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-4">参数名称</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" type="text" class="form-control" name="paramName" value="" />
                                    </div>
                                </div>
                                <div class="form-group flag">
                                    <label class="col-lg-3 control-label form-required form-required-4">采集方式</label>
                                    <div class="col-lg-7">
                                        <select name="collectionType" class="form-control collectionType">
                                            <option value="">请输入</option>
                                            <option value="1">PLC</option>
                                            <option value="2">文件</option>
                                            <option value="3">数据库</option>
                                            <option value="4">上机位</option>
                                        </select>
                                    </div>
                                </div>

                                <!--
                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-5">PLC地址</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" type="text" class="form-control" name="" id="" value="" />
                                    </div>
                                </div>
                                 -->

                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-4">数据位数</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" type="text" class="form-control" name="dataLength" value="" />
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-5">DCS参数名</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" type="text" class="form-control" name="paramField" value="" />
                                    </div>
                                </div>

                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="col-lg-3 control-label">报警编码</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" type="text" class="form-control" name="alarmCode" value="" />
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-4">工艺单位</label>
                                    <div class="col-lg-7">
                                        <select  class="form-control processRange"  name="processRange">
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-lg-3 control-label">缩放比例</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" type="text" class="form-control" name="enlargeNum" value="" />
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-4">数据类型</label>
                                    <div class="col-lg-7">
                                        <select name="dataType" class="form-control dataType" value="">
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-4">读写属性</label>
                                    <div class="col-lg-7">
                                        <select name="rwAttr" class="form-control rwAttr">
                                            <option value="0">只读</option>
                                            <option value="1">只写</option>
                                            <option value="2">可读可写</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-5">采集项类型</label>
                                    <div class="col-lg-7">
                                        <select name="paramType" class="form-control paramType" value="">
                                            <option value="1">过程参数</option>
                                            <option value="2">结果参数</option>
                                            <option value="3">环境参数</option>
                                            <option value="4">状态参数</option>
                                            <option value="5">告警参数</option>
                                        </select>
                                    </div>
                                </div>





                                <!-- <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-6">是否自动告警</label>
                                    <div class="col-lg-7">
                                        <select name="isAutoAlarm" class="form-control isAutoAlarm">
                                            <option value="0">是</option>
                                            <option value="1">否</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-6">告警名称定义</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" class="form-control autoAlarmName" type="text" name="autoAlarmName" value="" />
                                    </div>
                                </div> -->
                                <div class="form-group">
                                    <label class="col-lg-3 control-label form-required form-required-5">保留小数位</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" type="text" class="form-control" name="decimalPos" value="" />
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-lg-3 control-label">SPC标准值</label>
                                    <div class="col-lg-7">
                                        <input autocomplete="new-password" class="form-control spcValue" type="text" name="spcValue" value=""/>
                                    </div>
                                </div>

                            </div>






                            <!-- 隐藏唯一id -->
                            <input autocomplete="new-password" type="hidden" name="pkId" value="" />
                        </form>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary yes">保存</button>
                <button type="button" class="btn btn-default cancel" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>
<!--采集地址弹框-->
<div class="modal fade" id="myModal-addr" tabindex="-1" role="dialog" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">采集地址</h4>
            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" data-dismiss="modal">确定</button>
                <button type="button" class="btn btn-default " data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>

<form id="batchImportForm"  class="form-horizontal tool-maintain-item-form" action="">
    <div class="modal fade" id="batchImportModal" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title"></h4>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="form-group">
                            <label class="col-lg-4 control-label">上传文件</label>
                            <div class="col-lg-7">
                                <input class="form-control" type="file" name="file" id="batchImportFile"/>
                            </div>
                        </div>
                        <div class="error-tips" id="batchImportTips" style="padding-left: 210px;color: red;display:none"></div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </div>
        </div>
    </div>
</form>

<script id="showCollection" type="text/html">

    <ul class="showCollectionFlag">
        {{if data.collectionType == '1'}}
        <li>
            <label>PLC地址：</label>
            <span>{{data.plcAddr}}</span>
        </li>
        {{else if data.collectionType == '2'}}
        <li>
            <label>文件名：</label>
            <span>{{data.fileName}}</span>
        </li>
        <li>
            <label>文件类型：</label>
            <span>
						{{if data.fileType=="1"}}
excel
						{{else if data.fileType=="2"}}
csv
{{else if data.fileType=="3"}}
text

{{/if}}
</span>
        </li>
        <li>
            <label>列号：</label>
            <span>{{data.fileColumn}}</span>
        </li>
        <li>
            <label>是否忽略首行：</label>
            <span>{{if data.fileIgnoreFirst == '1'}}是{{else}}否{{/if}}</span>
        </li>

        {{else if data.collectionType == '3'}}

        <li>
            <label>字段地址：</label>
            <span>{{data.databaseParamAddr}}</span>
        </li>

        {{else if data.collectionType == '4'}}
        <li>
            <label>数据定义：</label>
            <span>
						{{if data.upperDefinition=="1"}}
结果数据
						{{else if data.upperDefinition=="2"}}
过程数据
{{else if data.upperDefinition=="3"}}
报警数据
{{else if data.upperDefinition=="4"}}
状态数据
{{else if data.upperDefinition=="5"}}
易损件数据
{{/if}}
						</span>
        </li>
        <li>
            <label>参数名称：</label>
            <span>{{data.upperParamName}}</span>
        </li>
        <li>
            <label>参数字段：</label>
            <span>{{data.upperParamField}}</span>
        </li>
        {{/if}}
    </ul>

</script>

<script th:src="@{/js/equipment/register/modelMange/param.js}" src="../../static/js/equipment/register/modelMange/param.js"></script>
<script th:src="@{/3thExt/template-web.js}" src="../../static/3thExt/template-web.js"></script>
<script type="text/javascript">

    $(function () {
//--------------------------------------------时间设置--------------------------------------------
        $(".form_datetime").datetimepicker({format: 'yyyy-mm-dd hh:ii'});
//--------------------------------------------搜索下拉框设置--------------------------------------------
        $('#e21').select2({});
        $('#modal-select').select2({});
//--------------------------------------------表单验证设置--------------------------------------------
        $('#defaultForm')
            .bootstrapValidator({
                message: 'This value is not valid',
                feedbackIcons: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    username: {
                        message: 'The username is not valid',
                        validators: {
                            notEmpty: {
                                message: 'The username is required and can\'t be empty'
                            },
                            stringLength: {
                                min: 6,
                                max: 30,
                                message: 'The username must be more than 6 and less than 30 characters long'
                            },
                            /*remote: {
                                url: 'remote.php',
                                message: 'The username is not available'
                            },*/
                            regexp: {
                                regexp: /^[a-zA-Z0-9_\.]+$/,
                                message: 'The username can only consist of alphabetical, number, dot and underscore'
                            }
                        }
                    },
                    email: {
                        validators: {
                            notEmpty: {
                                message: 'The email address is required and can\'t be empty'
                            },
                            emailAddress: {
                                message: 'The input is not a valid email address'
                            }
                        }
                    },
                    password: {
                        validators: {
                            notEmpty: {
                                message: 'The password is required and can\'t be empty'
                            }
                        }
                    }
                }
            })
            .on('success.form.bv', function(e) {
                // Prevent form submission
                e.preventDefault();

                // Get the form instance
                var $form = $(e.target);

                // Get the BootstrapValidator instance
                var bv = $form.data('bootstrapValidator');

                // Use Ajax to submit form data
                $.post($form.attr('action'), $form.serialize(), function(result) {
                    console.log(result);
                }, 'json');
            });
//--------------------------------------------文件上传设置--------------------------------------------
        $("#uploadfile").fileinput({

            language: 'zh', //设置语言

            uploadUrl:"http://127.0.0.1/testDemo/fileupload/upload.do", //上传的地址

            allowedFileExtensions: ['jpg', 'gif', 'png'],//接收的文件后缀

            //uploadExtraData:{"id": 1, "fileName":'123.mp3'},

            uploadAsync: true, //默认异步上传

            showUpload:true, //是否显示上传按钮

            showRemove :true, //显示移除按钮

            showPreview :true, //是否显示预览

            showCaption:false,//是否显示标题

            browseClass:"btn btn-primary", //按钮样式

            dropZoneEnabled: false,//是否显示拖拽区域

            //minImageWidth: 50, //图片的最小宽度

            //minImageHeight: 50,//图片的最小高度

            //maxImageWidth: 1000,//图片的最大宽度

            //maxImageHeight: 1000,//图片的最大高度

            //maxFileSize:0,//单位为kb，如果为0表示不限制文件大小

            //minFileCount: 0,

            maxFileCount:10, //表示允许同时上传的最大文件个数

            enctype:'multipart/form-data',

            validateInitialCount:true,

            previewFileIcon: "<iclass='glyphicon glyphicon-king'></i>",

            msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",

        }).on("fileuploaded", function (event, data, previewId, index){

        });
    })

</script>

<script id="selectType" type="text/html">

    {{if data.type == '1'}}
    <div class="form-group selectTypeRemove">
        <label class="col-lg-3 control-label form-required form-required-4">PLC地址</label>
        <div class="col-lg-7">
            <input class="form-control" type="text" name="plcAddr" id="" value="{{if data.data}}{{data.data.plcAddr}}{{/if}}" />
        </div>
    </div>



    {{else if data.type == '2'}}
    <div class="form-group selectTypeRemove">
        <label class="col-lg-3 control-label form-required form-required-3">文件名</label>
        <div class="col-lg-7">
            <input class="form-control" type="text" name="fileName" value="{{if data.data}}{{data.data.fileName}}{{/if}}" />
        </div>
    </div>
    <div class="form-group selectTypeRemove">
        <label class="col-lg-3 control-label form-required form-required-4">文件类型</label>
        <div class="col-lg-7">
            <select name="fileType" class="form-control">
                <option value="1" {{if data.data && (data.data.fileType=='1')}}selected="selected"{{/if}}>excel</option>
                <option value="2" {{if data.data && (data.data.fileType=='2')}}selected="selected"{{/if}}>csv</option>
                <option value="3" {{if data.data && (data.data.fileType=='3')}}selected="selected"{{/if}}>text</option>
            </select>
        </div>
    </div>
    <div class="form-group selectTypeRemove">
        <label class="col-lg-3 control-label form-required form-required-2">列号</label>
        <div class="col-lg-7">
            <input class="form-control" type="text" name="fileColumn" value="{{if data.data}}{{data.data.fileColumn}}{{/if}}" />
        </div>
    </div>
    <div class="form-group selectTypeRemove">
        <label class="col-lg-3 control-label">是否忽略首行</label>
        <div class="col-lg-7">
            <input  type="checkbox" name="fileIgnoreFirst" value="1" {{if data.data && (data.data.fileIgnoreFirst=='1')}}checked="checked"{{/if}} />
        </div>
    </div>



    {{else if data.type == '3'}}
    <div class="form-group selectTypeRemove">
        <label class="col-lg-3 control-label form-required form-required-4">字段地址</label>
        <div class="col-lg-7">
            <input class="form-control" type="text" name="databaseParamAddr" id="" value="{{if data.data}}{{data.data.databaseParamAddr}}{{/if}}" />
        </div>
    </div>




    {{else if data.type == '4'}}
    <div class="form-group selectTypeRemove">
        <label class="col-lg-3 control-label form-required form-required-4">数据定义</label>
        <div class="col-lg-7">
            <select name="upperDefinition" class="form-control">
                <option value="1" {{if data.data && (data.data.upperDefinition=='1')}}selected="selected"{{/if}}>结果数据</option>
                <option value="2" {{if data.data && (data.data.upperDefinition=='2')}}selected="selected"{{/if}}>过程数据</option>
                <option value="3" {{if data.data && (data.data.upperDefinition=='3')}}selected="selected"{{/if}}>报警数据</option>
                <option value="4" {{if data.data && (data.data.upperDefinition=='4')}}selected="selected"{{/if}}>状态数据</option>
                <option value="5" {{if data.data && (data.data.upperDefinition=='5')}}selected="selected"{{/if}}>易损件数据</option>
            </select>
        </div>
    </div>
    <div class="form-group selectTypeRemove">
        <label class="col-lg-3 control-label form-required form-required-4">参数名称</label>
        <div class="col-lg-7">
            <input class="form-control" type="text" name="upperParamName" value="{{if data.data}}{{data.data.upperParamName}}{{/if}}" />
        </div>
    </div>

    <div class="form-group selectTypeRemove">
        <label class="col-lg-3 control-label form-required form-required-4">参数字段</label>
        <div class="col-lg-7">
            <input class="form-control" type="text" name="upperParamField" value="{{if data.data}}{{data.data.upperParamField}}{{/if}}" />
        </div>
    </div>
    {{/if}}

</script>


<script id="showCollection" type="text/html">


    <ul class="showCollectionFlag">
        {{if data.collectionType == '1'}}
        <li>
            <label>PLC地址：</label>
            <span>{{data.plcAddr}}</span>
        </li>
        {{else if data.collectionType == '2'}}

        <li>
            <label>文件地址：</label>
            <span>{{data.fileAddr}}</span>
        </li>
        <li>
            <label>文件名：</label>
            <span>{{data.fileName}}</span>
        </li>
        <li>
            <label>文件类型：</label>
            <span>
						{{if data.fileType=="1"}}
excel
						{{else if data.fileType=="2"}}
csv
{{else if data.fileType=="3"}}
text

{{/if}}
</span>
        </li>
        <li>
            <label>列号：</label>
            <span>{{data.fileColumn}}</span>
        </li>
        <li>
            <label>是否忽略首行：</label>
            <span>{{if data.fileIgnoreFirst == '1'}}是{{else}}否{{/if}}</span>
        </li>

        {{else if data.collectionType == '3'}}

        <li>
            <label>字段地址：</label>
            <span>{{data.databaseParamAddr}}</span>
        </li>

        {{else if data.collectionType == '4'}}
        <li>
            <label>数据定义：</label>
            <span>
						{{if data.upperDefinition=="1"}}
结果数据
						{{else if data.upperDefinition=="2"}}
过程数据
{{else if data.upperDefinition=="3"}}
报警数据
{{else if data.upperDefinition=="4"}}	
状态数据
{{else if data.upperDefinition=="5"}}
易损件数据
{{/if}}
						</span>
        </li>
        <li>
            <label>参数名称：</label>
            <span>{{data.upperParamName}}</span>
        </li>
        <li>
            <label>参数字段：</label>
            <span>{{data.upperParamField}}</span>
        </li>
        {{/if}}
    </ul>

</script>
</body>
</html>